import React, { Component } from 'react';
import Taro from '@tarojs/taro';
import {AtIcon} from "taro-ui";
import {View, Text, Image} from '@tarojs/components'
import {http} from '../utils/http'
import {
  GET_IMG_BYWORD, TECH_SUPPORT, RESOURCE_URL
} from '../constants/api'
import {GetRequest, vcmonitor} from "../utils/tools";
import {h5Wx} from "../utils/h5.service";
import {platform} from "../utils/platform-settting.service";
import GzhAuth from "../components/gzh-auth/gzh-auth"
import './list.scss'

export default class CheckTicket extends Component {

  state: {
    wordImg: [] | false
    name: string
    id: number
    pid: number
    url: string
    type: string
  } = {
    wordImg: false,
    name: '',
    id: 0,
    pid: 0,
    url: '',
    type: ''
  }

  async UNSAFE_componentWillMount() {
    if (process.env.TARO_ENV === 'h5') {
      const {pid, id, name} = Taro.getCurrentInstance().router.params
      await h5Wx.getConfig()
      const shareData = {
        title: platform.info.platformName,
        desc: name,
        link: window.location.origin + '/words/preview?pid=' + pid + '&id=' + id + '&name=' + name,
        imgUrl: platform.info.platformLogo
      }
      h5Wx.share(shareData)
    }
    const support = await http.get(TECH_SUPPORT, {})
    this.setState({support})
    if (process.env.TARO_ENV === "weapp") {
      Taro.hideShareMenu()
    }
  }

  async componentDidShow() {
    vcmonitor(this)
    const {pid, id, name, url, type} = Taro.getCurrentInstance().router.params
    const wordImg = await http.get(GET_IMG_BYWORD, {id: pid, resourceId: id})
    this.setState({wordImg, id, pid, name, url, type})
    Taro.setNavigationBarTitle({
      title: name
    })
  }

  onShareAppMessage() {
    return {
      title: this.state.name,
      path: '/words/preview?pid=' + this.state.pid + '&id=' + this.state.id + '&name=' + this.state.name + `&sKey=${Taro.getStorageSync('sKey' || '')}`
    }
  }

  downloadFile() {
    const {url} = this.state
    const filePath = RESOURCE_URL + url
    Taro.downloadFile({ // 下载对应文件
      url: filePath,
      success: function (res) {
        Taro.saveFile({
          tempFilePath: res.tempFilePath,
          success: function (res) {
            const savedFilePath = res.savedFilePath;
            Taro.openDocument({
              filePath: savedFilePath,
            });
          }
        });
      }
    })
  }

  look(current) {
    Taro.previewImage({
      current, // 当前显示图片的http链接
      urls: [current] // 需要预览的图片http链接列表
    })
  }

  goDownlode() {
    Taro.navigateTo({
      url: '/words/downlode?url=' + this.state.url
    })
  }

  goShare() {
    Taro.navigateTo({
      url: '/words/share?url=' + this.state.url + '&pid=' + this.state.pid + '&id=' + this.state.id + '&type=' + this.state.type + '&name=' + this.state.name
    })
  }

  render() {
    const {wordImg} = this.state
    return (
      <View className='words-root'>
        <GzhAuth />
        {wordImg && wordImg.length > 0 &&
        <View className='wordImg-box'>
          {wordImg.map((item, index) =>
            <Image className='wordImg-item' src={item} mode='widthFix' key={index}
              onClick={this.look.bind(this, item)}
            />
          )}
          <View className='wordBottom'>
            <View className='downlode' onClick={this.goDownlode.bind(this)}><AtIcon value='download' size='15'
              color='#383838'
            />
              <Text>下载文档</Text></View>
            <View className='share' onClick={this.goShare.bind(this)}><AtIcon prefixClass='xxhz' value='fenxiang'
              size='20' color='#383838'
            /></View>
          </View>
        </View>
        }
      </View>
    )
  }
}
